import Card from '@/components/Card';
import { stationControllerGetStation as getDetail } from '@/services/ess/station';
import React, { useEffect, useState } from 'react';
import { useIntl, useSearchParams } from 'umi';
import BaseInfo from './components/BaseInfo';
import ServiceForm from './components/ServiceForm';

const Config: React.FC = () => {
  const [searchParams] = useSearchParams();
  const id = searchParams.get('id');
  const intl = useIntl();

  const [detailInfo, setDetailInfo] = useState({});

  useEffect(() => {
    getDetail({ id }).then((res) => {
      setDetailInfo(res?.data || {});
    });
  }, []);

  return (
    <div>
      <BaseInfo detailInfo={detailInfo} />
      <Card
        title={intl.formatMessage({
          id: 'systemManagement.siteAdministrationMenu.serviceConfiguration',
        })}
        style={{ marginTop: 20 }}
      >
        <ServiceForm detailInfo={detailInfo} />
      </Card>
    </div>
  );
};
export default Config;
